<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>显示模式</title>
		<style>
			h2,p,span,del,a,input{
				background-color: green;
				width: 100px;
				height: 100px;
				margin: auto;         /* 给盒子水平居中 */
				taxt-align: center;    /* 文本水平居中 */
			}
		</style>
	</head>
	<body>
		<!--
		标签的显示模式
		 1.块元素：
		   比较霸道，单独占一行
		   默认宽度是父级元素宽度的100%
		   可以设置宽、高和对齐属性
		   块元素可以包含行内元素和其他块元素
		   文本标签（h1~h6,p）内不要使用块元素
		 2.行内元素：
		   一行显示多个
		   默认的宽度是内容的宽度
		   宽、高和对齐属性设置无效
		   行内元素只包含文本或其他行内元素，一般不要包含块元素。
		   链接标签不要包含其他链接
		 3.行内块元素    inline-block:
		   一行显示多个
		   默认的宽度是内容的宽度
		   可以设置宽、高和对齐属性
		   
		元素显示模式的转换：
		  display:block/inline/inline-block;
		  -->
		< img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/adde6bae41441887017824f46cf31602.png?thumb=1&w=250&h=250&f=webp&q=90"/>
		<h2>Redmi Turbo 3</h2>
		<p>性能旋风，席卷而来</p >
		<span>1999元</span>
		<del>2199元</del>
		嗯
		<input type="text">
	</body>
</html>